<template>
  <div class="layout layout-100">
    <Layout class="layout-100">
      <Header class="header-cont main__title--top">{{this.$route.params.name}}</Header>
      <Content class="content-cont">
        <Tabs value="1" @on-click="tabpaneBtn">
          <TabPane label="Ⅰ级风险" name="1">
          </TabPane>
          <TabPane label="Ⅱ级风险" name="2">
          </TabPane>
          <TabPane label="Ⅲ级风险" name="3" v-if="personType === 2" >
            <!--v-if="personType === 2"  公司的显示三级, 注意:后端返回的数据  目前是 四级的, 假如要全部 方案制定的话,就有问题-->
          </TabPane>
        </Tabs>
        <Table
          border
          ref="selection"
          :columns="columns"
          :data="allList"
          @on-selection-change="selectChangeRiado">
          <template slot-scope="{ row, index }" slot="action">
            <span
              title="方案制定"
              class="button-class"
              type="text"
              :style="{color:(row.isName ==1?'#ccc':'#0099ff')}"
              @click="issuePassBtn(row)" >方案制定</span>
            <span
              title="详情"
              class="button-class"
              type="text"
              @click="destroyBtn(row)" >详情</span>
          </template>
          <template slot-scope="{ row, index }" slot="status">
            <span style="color: blue" v-if="row.isName == 1">是</span>
            <span style="color: red" v-if="row.isName != 1">否</span>
          </template>
        </Table>
      </Content>
      <Footer class="footer-cont" >
        <Button type="primary" @click="saveSubmit()">保存</Button>
        <Button @click="closetab">取消</Button>
      </Footer>
    </Layout>
    <Modal
      v-model="destroyModal"
      width="70%"
      class="modal"
      :mask-closable="false"
      title="方案制定">
      <div class="modal-content">
        <planFormulationModal :id="riskOrderId" :userLists="saveListObj" ref="description" @description="getDescription" @getData="getData"></planFormulationModal>
      </div>
      <div slot="footer">
        <Button type="primary" @click="saveModal">保存</Button>
        <Button type="text" @click="destroyModal=false">取消</Button>
      </div>
    </Modal>
    <Modal
      v-model="detailModal2"
      width="70%"
      class="modal"
      :footer-hide="true"
      title="详情">
      <div class="modal-content">
        <Form :show-message="false" label-position="top" >
          <Row >
            <Col span="12">
              <FormItem label="公司名称">
                <Input class="width90" v-model.trim="detailData.orgName" readonly/>
              </FormItem>
            </Col>
            <Col span="12">
              <FormItem label="项目名称" >
                <Input class="width90" v-model.trim="detailData.proName" readonly/>
              </FormItem>
            </Col>
            <Col span="12">
              <FormItem label="工点名称">
                <Input class="width90" v-model.trim="detailData.pointName" readonly/>
              </FormItem>
            </Col>
            <Col span="12">
              <FormItem label="工点风险等级">
                <Input class="width90" v-model.trim="detailData.distRiskGradeName"  readonly/>
              </FormItem>
            </Col>
            <Col span="12">
              <FormItem label="起始时间">
                <Input class="width90" v-model.trim="detailData.startTime" readonly/>
              </FormItem>
            </Col>
            <Col span="12">
              <FormItem label="结束时间">
                <Input class="width90" v-model.trim="detailData.endTime" readonly/>
              </FormItem>
            </Col>
            <Col span="12">
              <FormItem label="当月是否作业">
                <Input class="width90" v-model.trim="detailData.isWorkedThisMonth" readonly/>
              </FormItem>
            </Col>
            <Col span="24">
              <FormItem label="工点描述">
                <Input style="width: 95%" type="textarea" v-model.trim="detailData.note" readonly/>
              </FormItem>
            </Col>
            <Col span="12">
              <FormItem label="作业风险名称">
                <Input class="width90" v-model.trim="detailData.riskOperationName"  readonly/>
              </FormItem>
            </Col>
            <Col span="12">
              <FormItem label="作业风险类型">
                <Input class="width90" v-model.trim="detailData.riskCategoryNames" readonly/>
              </FormItem>
            </Col>
            <Col span="12">
              <FormItem label="作业风险等级">
                <Input class="width90" v-model.trim="detailData.riskLevelName" readonly/>
              </FormItem>
            </Col>
            <Col span="12">
              <FormItem label="分级方法">
                <Input class="width90" v-model.trim="detailData.classificationMethodName" readonly/>
              </FormItem>
            </Col>
            <Col span="24">
              <FormItem label="具体风险描述">
                <Input style="width: 95%" type="textarea" v-model.trim="detailData.riskDescription" readonly/>
              </FormItem>
            </Col>
            <Col span="24">
              <FormItem label="工程公司管控要求">
                <Input style="width: 95%" type="textarea" v-model.trim="detailData.riskControlRequirementOne" readonly/>
              </FormItem>
            </Col>
            <Col span="24">
              <FormItem label="集团公司管控要求">
                <Input style="width: 95%" type="textarea" v-model.trim="detailData.riskControlRequirementTwo" readonly/>
              </FormItem>
            </Col>
            <Col span="24">
              <FormItem label="目前该风险安全控制情况">
                <Input style="width: 95%" type="textarea" v-model.trim="detailData.riskControlDetailOne" readonly/>
              </FormItem>
            </Col>
          </Row>
        </Form>
      </div>
    </Modal>
    <inquiries ref="isInquiriesBox"></inquiries>
    <checkPerson></checkPerson>
    <span class="inquiries" @click="replyChild()">问询</span>
  </div>
</template>

<script>
import inquiries from '../../components/modules/inquiries/index'
import checkPerson from '../../components/modules/inquiries/checkPerson'
  import planFormulationModal from './subgroup/planFormulationModal.vue'

  import { mapMutations } from 'vuex'
  export default {
    components: { planFormulationModal,inquiries,
      checkPerson},
    name:'monthly-accept',
    data(){
      return {
        personType:JSON.parse(localStorage.getItem('personType')),
        indexNum:'1',
        destroyModal:false,
        detailModal2:false,
        checkPersonModal:false,
        riskOrderId:'',
        description:'',
        type:'',
        saveListObj:[],
        detailData:[],
        recordList:[],
        measuresList:[],
        oneList:[],
        twoList:[],
        threeList:[],
        fourList:[],
        allList:[],
        coutList:[],
        useDataList:[],
        saveList:[],
        formData:{
          comment:''
        },
        columns:[
          {
            title: '序号',
            type: 'index',
            align: 'center',
            width: 70
          },
          {
            title: '项目名称',
            key: 'pointName',
            align: 'center',
          },{
            title: '工点名称',
            key: 'pointName',
            align: 'center',
          },
          {
            title: '开始时间',
            key: 'startTime',
            align: 'center',
            width: 130,
          },{
            title: '结束时间',
            key: 'endTime',
            align: 'center',
            width: 130,
          },{
            title: '下月是否在施',
            key: 'isWorkedThisMonth',
            align: 'center',
            width: 100,
          },{
            title: '作业风险类型',
            key:'riskCategoryNames',
            align: 'center',
          },{
            title: '作业风险名称',
            key:'riskOperationName',
            align: 'center',
          },{
            title: '方案总数',
            key:'measuresCnt',
            align: 'center',
          },{
            title: '方案是否制定',
            align: 'center',
            width:100,
            slot:'status',
          },{
            title: '操作',
            width: 150,
            align: 'center',
            slot: 'action'
          }
        ],
        columns2:[
          {
            title: '序号',
            type: 'index',
            align: 'center',
            width: 70
          },
          {
            title: '管控措施',
            key: 'measures',
            align: 'center',
            width:100,
          },
          {
            title: '项目部管控责任人',
            key: 'projectManagementDepartmentName',
            align: 'center',
            width: 100,
          },{
            title: '项目部分管领导',
            key: 'projectManagementLeaderName',
            align: 'center',
            width: 100,
          },{
            title: '项目部主管领导',
            key: 'leaderInChargeOfProjectDepartmentName',
            align: 'center',
            width: 100,
          },{
            title: '工程公司管理人员',
            key:'controlDepartmentOfEngineeringCompanyName',
            align: 'center',
            width: 100,
          },{
            title: '工程公司分管领导',
            key:'leaderInChargeOfEngineeringCompanyName',
            align: 'center',
            width: 100,
          },{
            title: '集团公司管理人员',
            key:'groupCompanyControlDepartmentName',
            align: 'center',
            width: 100,
          },{
            title: '集团公司分管领导',
            key:'leaderInChargeOfGroupCompanyName',
            align: 'center',
            width: 100,
          },{
            title: '措施类型',
            key:'measureTypeName',
            align: 'center',
            width:100,
          },{
            title: '频次',
            key:'frequencyName',
            align: 'center',
          }
        ],
      }
    },
    methods:{
      replyChild(){
        this.$refs.isInquiriesBox.isModel()
      },
      ...mapMutations([
        'closeTag'
      ]),
      closetab () {
        this.closeTag({
          name: this.$route.name,
          params: {...this.$route.params},
          query:{...this.$route.query}
        });
        this.$router.push({path:'/dynamic-control/monthly-dynamics'});
      },
      getDynamicRiskOrderoperation(){//信息--列表
        this.$api.MonthlyDynamics.getDynamicRiskOrderoperation(this.$route.params.id).then(res => {
          if(res.code === 200){
            if(res.data){
              this.oneList = res.data.one;
              this.twoList = res.data.two;
              this.threeList = res.data.three;
              this.fourList = res.data.four;
              if(this.oneList.length>0){
                this.oneList.map(val => {
                  val.startTime = this.$time(
                    new Date(val.startTime),
                    'yyyy-MM-dd'
                  )
                  val.endTime = this.$time(
                    new Date(val.endTime),
                    'yyyy-MM-dd'
                  )
                })
              }
              if(this.twoList.length>0){
                this.twoList.map(val => {
                  val.startTime = this.$time(
                    new Date(val.startTime),
                    'yyyy-MM-dd'
                  )
                  val.endTime = this.$time(
                    new Date(val.endTime),
                    'yyyy-MM-dd'
                  )
                })
              }
              if(this.threeList.length>0){
                this.threeList.map(val => {
                  val.startTime = this.$time(
                    new Date(val.startTime),
                    'yyyy-MM-dd'
                  )
                  val.endTime = this.$time(
                    new Date(val.endTime),
                    'yyyy-MM-dd'
                  )
                })
              }
              if(this.fourList.length>0){
                this.fourList.map(val => {
                  val.startTime = this.$time(
                    new Date(val.startTime),
                    'yyyy-MM-dd'
                  )
                  val.endTime = this.$time(
                    new Date(val.endTime),
                    'yyyy-MM-dd'
                  )
                })
              }
              this.allList = this.oneList;
              if(this.personType === 2){
                this.coutList = this.oneList.concat(this.twoList).concat(this.threeList);
              }else {
                this.coutList = this.oneList.concat(this.twoList);
              }
            }
          }else {
            this.$Message.warning(res.message)
          }
        })
      },
      destroyBtn(row){//详情
        this.detailModal2 = true;
        this.$api.MonthlyDynamics.getDynamicRiskOrderdetailsecond(row.riskOrderId).then(res => {
          if(res.code === 200){
            this.detailData = res.data;
            this.detailData.startTime = this.$time(
              new Date(this.detailData.startTime),
              'yyyy-MM-dd'
            );
            this.detailData.endTime = this.$time(
              new Date(this.detailData.endTime),
              'yyyy-MM-dd'
            )
            this.measuresList = res.data.measuresList;
            this.recordList = res.data.recordList;
            if(this.recordList){
              this.recordList.map(value => {
                value.operationTime = this.$time(
                  new Date(value.operationTime),
                  'yyyy-MM-dd hh:mm:ss'
                )
              })
            }
          }else {
            this.$Message.warning(res.message)
          }
        })
      },
      getDynamicRiskOrderacception(){
        if(!this.coutList || this.coutList<=0){
          this.$Message.warning('没有可接收的内容');
          return;
        }
        if(!this.saveList || this.saveList<=0){
          this.$Message.warning('请先方案制定');
          return;
        }
        if(this.coutList.length > this.saveList.length){
          this.$Message.warning('您还有未方案制定的数据');
          return;
        }
        let params = {
          array:this.saveList,
          proName : this.$route.query.proName,
          dynamicRiskOrderListName : this.$route.query.dynamicRiskOrderListName
        }
        this.$api.MonthlyDynamics.getDynamicRiskOrderacception(params).then(res => {
          if(res.code === 200){
            this.$Message.success(res.message);
            this.closetab();
          }else {
            this.$Message.warning(res.message)
          }
        })
      },
      issuePassBtn(row){//方案制定
        if(row.isName != 1){
          this.saveListObj = this.useDataList;
          this.riskOrderId = row.riskOrderId;
          this.destroyModal = true;
        }
      },
      saveModal(){//方案制定--前端保存
        this.$refs.description.textClick();
        if(!this.description && this.personType===2){
          this.$Message.warning('请输入说明');
          return;
        }
        console.log(this.useDataList)
        if(this.useDataList.length<=0){
          this.$Message.warning('请先选择人员');
          return;
        }
        let istrue = false;
        let obj = {
          measuresPeople:[],
        }
        this.useDataList.forEach(item => {
          if(this.personType === 2){
            if(!item.controlDepartmentOfEngineeringCompanyName || !item.leaderInChargeOfEngineeringCompanyName){
              istrue = true;
            }
          }else {
            if(!item.groupCompanyControlDepartmentName || !item.leaderInChargeOfGroupCompanyName){
              istrue = true;
            }
          }
          if((this.personType === 2 && item.controlDepartmentOfEngineeringCompanyName && item.leaderInChargeOfEngineeringCompanyName)
            || (this.personType === 1 && item.groupCompanyControlDepartmentName && item.leaderInChargeOfGroupCompanyName)
          ){
            let obj1 = {
              /*controllerOne:item.controllerOne,
              controllerTwo:item.controllerTwo,*/
              measuresId:item.id,//措施方案id
            };
            if(this.personType === 2){
              obj1.controlDepartmentOfEngineeringCompany = item.controlDepartmentOfEngineeringCompany;
              obj1.leaderInChargeOfEngineeringCompany = item.leaderInChargeOfEngineeringCompany;
            }
            if(this.personType === 1){
              obj1.groupCompanyControlDepartment = item.groupCompanyControlDepartment;
              obj1.leaderInChargeOfGroupCompany = item.leaderInChargeOfGroupCompany;
            }
            obj.measuresPeople.push(obj1);
            obj.riskControlRequirementTwo = this.description;
            obj.riskOrderId = item.setRiskOrderId;
            this.allList.map(val => {
              if(val.riskOrderId === item.setRiskOrderId){
                this.$set(val, 'isName', 1);
              }
            })
            if(this.saveList.length>0){
              this.saveList.map((value,index) => {
                if(item.setRiskOrderId === value.riskOrderId){
                  this.saveList.splice(index,1)
                }
              })
            }
          }
        })
        if(istrue){
          this.$Message.warning('您还有未选择人员的数据');
          return;
        }
        this.saveList.push(obj);
        this.destroyModal = false;
      },
      //子组件 --数据开始
      getDescription(text){
        this.description = text;
      },
      getData(data){
        this.useDataList = data;
        //console.log(data)
      },
      //子组件 --数据结束
      saveSubmit(){//保存
        this.getDynamicRiskOrderacception();
      },
      tabpaneBtn(e){//切换
        this.indexNum = e;
        if(this.indexNum === '1'){
          this.allList = this.oneList;
        }else if(this.indexNum === '2'){
          this.allList = this.twoList;
        }else if(this.indexNum === '3'){
          this.allList = this.threeList;
        }else {
          this.allList = this.fourList;
        }
        this.allList.map(val => {//切换时候  回显 选中的--和已经处理过的
          this.saveList.map(val2 => {
            if(val.riskOrderId === val2.riskOrderId){
              this.$set(val, 'isName', 1);
            }
          })
        })
      },
      //check选
      selectChangeRiado(e) {
        this.deleteList = e;
      },

    },
    mounted() {
      this.getDynamicRiskOrderoperation();
    },
  };
</script>

<style lang="scss" scoped>
  .button-s {
    margin-bottom: 15px;
    button {
      margin-right: 15px;
    }
  }
  .width90{
    width: 90%;
  }
</style>

